//------ SASS Useful Mixins ---------------------------------------------

// by Ryan Burgess
// https://github.com/ryanburgess/SASS-Useful-Mixins
// MIT © Ryan Burgess

// ----------------------------------------------------------------------

// Animated link that has a fade-in underline

// ----------------------------------------------------------------------

// example: @include animate-link($screenGreen, $gothamMedium, 14);

@mixin animate-link($color, $font, $fontSize) {
  font-family: $font;

  @include single-transition(border, 0.2s, ease-in-out, 0);

  text-decoration: none;
  color: $color;
  border-bottom: 1px solid transparent;

  @include rem('font-size', $fontSize);

  &:focus,
  &:hover {
    border-color: $color;
  }
}
